.WJHdeviceA01 {
	width: 100%;
	height: 100%;
	padding: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;

	& > div:first-child {
		display: flex;
		align-items: center;
		justify-content: center;
		font-family: MicrosoftYaHei, MicrosoftYaHei;
		font-weight: bold;
		font-size: 18px;
		color: #23dcc9;
		height: 40px;
		background: linear-gradient(
			90deg,
			rgba(0, 115, 129, 0),
			rgba(0, 115, 129, 1),
			rgba(0, 115, 129, 0)
		);
		padding: 0 64 px;

		& > span {
			font-family: MicrosoftYaHei, MicrosoftYaHei;
			font-weight: bold;
			font-size: 18px;
			color: #ffffff;
			margin: 0 16px;
		}
	}

	& > div:last-child {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;

		& > div {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 16px 40px;

			& > img {
				width: 67px;
				height: 45px;
				margin-right: 40px;
			}

			& > div {
				display: flex;
				align-items: center;
				justify-content: center;
				flex-direction: column;
				flex: 1;

				& > div {
					width: 100%;
					display: flex;
					align-items: center;
					justify-content: space-between;

					&:first-child {
						font-family: MicrosoftYaHei, MicrosoftYaHei;
						font-weight: bold;
						font-size: 12px;
						color: #ffffff;
					}

					&:last-child {
						font-family: MicrosoftYaHei, MicrosoftYaHei;
						font-weight: bold;
						font-size: 12px;
						color: #00f0ff;
					}

					&:nth-child(2) {
						width: 100%;
						height: 8px;
						background: #016378;
						border-radius: 4px;
						margin: 4px 0;
						position: relative;
						z-index: 1;
						overflow: hidden;

						&::after {
							position: absolute;
							content: "";
							left: 0;
							top: 0;
							width: calc(var(--width) * 100%);
							height: 100%;
							border-radius: 4px;
							background: rgba(0, 240, 255, 1);
						}
					}
				}
			}
		}
	}
}
